<template>
	<view @click="toDetail" style="margin-top: 20rpx;" class="imgItem">
		<image lazy-load class="imgBox" :src="nowItem.coverImgUrl"></image>
		<view style="text-align: center;color: #333333;font-size: 28rpx;margin-top: 15rpx;" class="clamp">{{ nowItem.title }}</view>
		<view v-if="type == 'ttStyleFive'" style="text-align: center;color: #333333;font-size: 26rpx;margin-top: 2rpx;">{{ nowItem.finish ? '已完结共' + nowItem.updateOfEpisodes + '集' : '更新至第' + nowItem.updateOfEpisodes + '集' }}</view>
<!-- 		<view style="text-align: center;color: #B3B3B3;font-size: 26rpx;margin-top: 2rpx;">
			{{ nowItem.finish ? '已完结共' + nowItem.updateOfEpisodes + '集' : '更新至第' + nowItem.updateOfEpisodes + '集' }}
		</view> -->
	</view>
</template>

<script>
	export default {
		props:{
			nowItem:{
				type:Object,
				default:()=>{
					return {}
				}
			},
			duration:{
				type:String,
				default:'0'
			},
			type:{
				type:String,
				default:'0'
			}
		},
		data() {
			return {
			}
		},
		methods: {
			toDetail(type) {
				this.zwyRouter(`../video/video?fakeId=${this.nowItem.fakeId}&compilationId=${this.nowItem.compilationId}`);
			},
		},
		onReady() {
		},
		created() {
		}
	}
</script>

<style lang="scss" scoped>
	.imgItem {
		.imgDesTitle {
			flex: 1;
			overflow: hidden;
			-ms-text-overflow: ellipsis;
			text-overflow: ellipsis;
			white-space: nowrap;
		}
		.imgLabel {
			margin-right: 5rpx;
			font-size: 21rpx;
			color: white;
			width: 55rpx;
			height: 29rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: 4rpx;
		}
		.labelColor0 {
			background: linear-gradient(225deg, rgba(255, 185, 92, 1) 0%, rgba(247, 123, 0, 1) 100%);
		}
		.labelColor2 {
			background: linear-gradient(225deg, rgba(155, 226, 91, 1) 0%, rgba(99, 171, 21, 1) 100%);
		}
		.labelColor1 {
			background: linear-gradient(225deg, rgb(250, 132, 162) 0%, rgb(255, 129, 160) 30%);
		}
		.labelColor3 {
			background: linear-gradient(225deg, rgba(255, 185, 92, 1) 0%, rgba(247, 123, 0, 1) 100%);
		}
		.labelColor4 {
			background: linear-gradient(225deg, rgb(11, 185, 234) 0%, rgb(72, 211, 250) 100%);
		}
		.labelColor5 {
			background: linear-gradient(225deg, rgb(220, 124, 253) 0%, rgb(248, 83, 246) 100%);
		}
		.imgDesBox {
			box-sizing: border-box;
			font-size: 26rpx;
			color: #474747;
			font-weight: bold;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
			height: 58rpx;
			display: flex;
			align-items: center;
			justify-content: flex-start;
			padding: 0 7rpx;
			box-sizing: border-box;
		}
		.imgBox {
			border-radius: 13rpx;
			position: relative;
			width: 200rpx;
			height: 260rpx;
		}
		.vipImg {
			width: 66rpx;
			height: 36rpx;
			position: absolute;
			left: 0;
			top: 0;
			z-index: 9;
		}
		width: 200rpx;
		box-sizing: border-box;
		display: flex;
		position: relative;
		margin-top: 19rpx;
		flex-direction: column;
		overflow: hidden;
	}
</style>
